<template>
	<view>
		<van-field label="姓名" input-align="right" data-type="name" right-icon="edit" @change="onChange" />
		<van-cell title="性别" :value="sex" is-link @click="onClickSex" />
		<van-field label="联系方式" type="digit" input-align="right" data-type="tel" right-icon="edit" @change="onChange" />
		<van-field label="身份证号" type="digit" input-align="right" data-type="idcard" right-icon="edit" @change="onChange"/>
		<van-cell title="驾照类型" :value="driverCard" is-link @click="onClickDriverCard" />
		
		<view style="text-align: center; margin: 20px 0;">
			<van-button :color="primaryColor" size="large" @click="onSubmit">确认提交</van-button>
		</view>
		
		<van-action-sheet
		  :show="showSexSheet"
		  :actions="[{name: '男'}, {name: '女'}]"
		  @close="onCloseSex"
		  @select="onSelectSex"
		/>
		
		<van-action-sheet
		  :show="showDriverCardSheet"
		  :actions="[{name: 'A1'}, {name: 'A2'}, {name: 'A3'}, {name: 'B1'}, {name: 'B2'}, {name: 'C1'}, {name: 'C2'}, {name: 'C3'}, {name: 'C4'}]"
		  @close="onCloseDriverCard"
		  @select="onSelectDriverCard"
		/>
		
		<van-dialog id="van-dialog" />
		<van-toast id="van-toast" />
	</view>
</template>

<script>
	import utils from '@/common/utils.js'
	import Dialog from '@/wxcomponents/dialog/dialog'
	import Toast from '@/wxcomponents/toast/toast'
	export default {
		data() {
			return {
				primaryColor: getApp().globalData.primaryColor,
				showSexSheet: false,
				sex:'请点击选择',
				showDriverCardSheet: false,
				driverCard: '请点击选择',
				reqData:{
					user:{
						roles: ["driver", "user"],
					}
				}
			};
		},
		methods:{
			onClickSex(){
				this.showSexSheet = true
			},
			onCloseSex(){
				this.showSexSheet = false
			},
			onSelectSex(e){
				this.sex = e.detail.name
			},
			onClickDriverCard(){
				this.showDriverCardSheet = true
			},
			onCloseDriverCard(){
				this.showDriverCardSheet = false
			},
			onSelectDriverCard(e){
				this.driverCard = e.detail.name
			},
			onChange(event){
				const type = event.currentTarget.dataset.type
				this.reqData.user[type] = event.detail
			},
			async onSubmit(){
				//check
				Dialog.confirm({
					title: '确认提交',
					message: '请确认是否新增司机'
				}).then(async() => {
					try{
						uni.showLoading({
							mask:true,
							title:'上传数据中...'
						})
						this.reqData.token = uni.getStorageSync('userinfo').token
						await utils.req('/user/addUser', this.reqData)
						uni.navigateBack({
							delta:1
						})
					}catch(e){
						console.error(e)
						Toast(e.msg)
					}finally{
						uni.hideLoading()
					}
				}).catch(() => {
					// on cancel
				});
				
			}
		}
	}
</script>

<style lang="scss">

</style>
